<template>
	<view>
		<view class="container">
			<!-- 红点 :class="{'active-dot': weiDuXiaoXi}" -->
			<view class="flex-box ptb35 plr30" :class="{'active-dot': user.total>0}" @click="msgList('user')">
				<image class="icon mr25" src="/static/icon/icon_tip.png" mode="aspectFit"></image>
				<view class="flex-1">
					<view class="flex-box mb15">
						<view class="fs30 col-3 flex-1">课程提示</view>
						<view class="fs24 col-9">{{user.message ? $formatDatetime(user.message.createtime,"yyyy-mm-dd hh:ii:ss") : ''}}</view>
					</view>
					<view class="fs24 col-9">{{user.message?user.message.title:''}}</view>
				</view>
			</view>
			<view class="flex-box ptb35 plr30" :class="{'active-dot': active.total>0}" @click="msgList('activity')">
				<image class="icon mr25" src="/static/icon/icon_news2.png" mode="aspectFit"></image>
				<view class="flex-1">
					<view class="flex-box mb15">
						<view class="fs30 col-3 flex-1">活动消息</view>
						<view class="fs24 col-9">{{active.message ? $formatDatetime(active.message.createtime,"yyyy-mm-dd hh:ii:ss") : ''}}</view>
					</view>
					<view class="fs24 col-9">{{active.message?active.message.name:''}}</view>
				</view>
			</view>
			<view class="flex-box ptb35 plr30" :class="{'active-dot': system.total>0}" @click="msgList('system')">
				<image class="icon mr25" src="/static/icon/icon_system.png" mode="aspectFit"></image>
				<view class="flex-1">
					<view class="flex-box mb15">
						<view class="fs30 col-3 flex-1">系统消息</view>
						<view class="fs24 col-9">{{system.message ? $formatDatetime(system.message.createtime,"yyyy-mm-dd hh:ii:ss") : ""}}</view>
					</view>
					<view class="fs24 col-9">{{system.message?system.message.name:''}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			user:{},
			active:{},
			system:[],
			weiDuXiaoXi:true
		};
	},
	onLoad(){
		this.fetchMessage();
	},
	methods: {
		fetchMessage(){
			this.$core.get({url:'xiluedu.message/summary',data:{},success:(ret)=>{
				 this.user = ret.data.user;
				 this.active = ret.data.activity;
				 this.system = ret.data.system;
			}});
		},
		msgList(type){
			uni.navigateTo({
				url: '/pages/msg_list/msg_list?type='+type
			})
		}
	}
};
</script>

<style scoped>
.icon {
	display: block;
	width: 80rpx;
	height: 80rpx;
}
.active-dot{
	position: relative;
}
.active-dot::after{
	content: '';
	position: absolute;
	top: 32.5rpx;
	left: 112.5rpx;
	display: block;
	width: 10rpx;
	height: 10rpx;
	border-radius: 50%;
	background-color: var(--normal);
}
</style>
